import dash
from dash import html, dcc
from dash.dependencies import Input, Output
import plotly.express as px
import pandas as pd

csv_gen = "../../res/topic_gen.csv"
csv_rt = "../../res/topic_rt.csv"
concat_df = None


def concat_csv_data():
    df_gen = pd.read_csv(csv_gen)
    df_rt = pd.read_csv(csv_rt)

    # 合并
    df = pd.concat([df_gen, df_rt], ignore_index=True)
    # 排序
    # df = df.sort_values(by="seq")
    df = df.sort_values(by="seq").reset_index(drop=True)  # reset_index 排序之后重置索引
    return df


# 创建Dash应用
app = dash.Dash(__name__)

# 定义布局
app.layout = html.Div(
    [
        html.H1("选择显示的数据"),
        dcc.RadioItems(
            id="column-selector",
            options=[
                {"label": "rate", "value": "rate"},
                {"label": "min", "value": "min"},
                {"label": "max", "value": "max"},
                {"label": "std_dev", "value": "std_dev"},
                {"label": "accum_dev", "value": "accum_dev"},
            ],
            value="rate",
        ),
        dcc.Graph(
            id="line-chart",
            style={"height": "600px"},
        ),
    ]
)


# 定义回调函数
@app.callback(Output("line-chart", "figure"), Input("column-selector", "value"))
def update_chart(selected_column):
    global concat_df
    df = concat_df
    fig = px.line(df, x="seq", y=selected_column, color="topic")
    return fig


if __name__ == "__main__":
    concat_df = concat_csv_data()
    app.run(debug=True, port=8090)
